 const musicContainer = document.getElementById('music-container');
 const playBtn = document.getElementById('play');
 const prevBtn = document.getElementById('prev');
 const nextBtn = document.getElementById('next');

 const audio = document.getElementById('audio');
 const progress = document.getElementById('progress');
 const progressContainer = document.getElementById('progress-container');
 const title = document.getElementById('title');
 const cover = document.getElementById('cover');


 // 歌名
 const songs = ['hey','summer','ukulele'];

 // 歌曲索引
 let songIndex = 2;

 //初次加载歌曲
 loadSong(songs[songIndex]);
  
 //更新歌曲信息
 function loadSong(song) {
    title.innerText = song
    audio.src = 'music/$(song).mp3';
    cover.src = 'images/${song}.jpg';
 }


   //播放歌曲
   function loadSong(song) {
     musicContainer.classList.add('play');
     playBtn.querySelector('i.fas').classList.remove('fa-play');
     playBtn.querySelector('i.fas').classList.add('fa-puase');

     audio.play();
 }

     //暂停歌曲
     function pauseSong() {
     musicContainer.classList.remove('play');
     playBtn.querySelector('i.fas').classList.add('fa-play');
     playBtn.querySelector('i.fas').classList.remove('fa-pause');

     audio.pause();
 }


      //更新进度条
      function updateprogress(e) {
        const { duration, currenTime } = e.srcElement;
        const progresspercent =(currenTime / duration) * 100;
        progress.style.width = '${progresspercent}%';
      }

      //设置进度条
      function setprogress(e) {
           const width = this.clientWidth;
           const clickx = e.offsetx;
           const duration = audio.duration;
           audio.currenTime = (clickx / width) * duration;

           }

      


 //事件监听
 playBtn.addEventListener('click', function(){
   const isPlaying = musicContainer.classList.contains('play');

   if(isPlaying) {
     pauseSong();
   } else {
    playsong();
   }

   }
)


    //改变歌曲
    prevBtn.addEventListener('click',prevSong);
    nextBtn.addEventListener('click',nextSong);

//时间/歌曲
audio.addEventListener('timeupdate',updateprogress)


    //在进度条上点击
    progressContainer.addEventListener('click', setprogress);

    //歌曲结束
    audio.addEventListener('ended', nextSong);




   //上一首歌曲
   function prevSong() {
    songIndex--;
     
    if (songIndex < 0) {
    songIndex = songs.length - 1;
}
  loadSong(songs[songIndex]);

  playsong();



   }



   //下一首歌曲
   function nextSong() {
     songIndex++;

     if (songIndex > songs.length - 1) {
       songIndex = 0;
}
   
loadSong(songs[songIndex]);
playsong();






   }